<!-- 
 * @Description:
 * @Date: 2024-06-25 21:24:10
 * @LastEditTime: 2024-09-13 10:45:59
-->
<!-- 使用 type="home" 属性设置首页，其他页面不需要设置，默认为page；推荐使用json5，更强大，且允许注释 -->
<route lang="json5" type="page">
{
  style: {
    navigationBarTitleText: '通知详情',
  },
}
</route>
<template>
  <view class="bg-#fff overflow-auto w-100% h-screen box-border p-20rpx">
    <view class="tobe-title mt-30rpx">{{ detailList.topic }}</view>
    <view class="flex items-center justify-between">
      <view>
        <view class="tobe-time mb-12rpx">
          发布日期： {{ formatTime(detailList.createTime, 'yyyy-MM-dd HH:mm') }}
        </view>
        <view class="tobe-time">发布人：{{ detailList.author }}</view>
      </view>
      <view>
        <wd-button plain size="small">{{ detailList.imageTextType }}</wd-button>
      </view>
    </view>
    <view class="tobe-line"></view>
    <view v-html="detailList.content"></view>
    <view v-for="val in fileList" :key="val.id">
      <view class="file-name" @click="downloadFile(val.url)">{{ val.name }}</view>
    </view>
  </view>
</template>

<script lang="ts" setup>
import { getMessageDetails, getMessageClass } from '@/service/partBuilding/index'
import { formatTime, updateImageUrls } from '@/utils/index'
import { useToast } from 'wot-design-uni'
const baseurl = ref(import.meta.env.VITE_SERVER_BASEURL)
const toast = useToast()
const detailList = ref({})
const fileList = ref([])
const imageList = ref([])
onLoad(async (options) => {
  const data: any = await getMessageDetails(Number(options.id))
  detailList.value = data.data
  fileList.value = data.data.fileDOList
  detailList.value.content = updateImageUrls(detailList.value.content)
  const params = reactive({
    pageNo: 1,
    pageSize: 100,
    dictType: 'countryside_image_text_type',
  })
  const list: any = await getMessageClass({ ...params })
  imageList.value = list.data.list
  imageList.value.forEach((item) => {
    if (item.id === detailList.value.imageTextType) {
      detailList.value.imageTextType = item.label
    }
  })
})

// const downloadFile = (url) => {
//   console.log(url, 'url')
//   const newUrl = `http://36.133.249.158:48080${url}`
//   console.log(newUrl, 'newUrl')
//   uni.downloadFile({
//     url: newUrl, // 后端返回的线上文件路径
//     success: function (res) {
//       console.log(res, 'res')
//       if (res.statusCode === 200) {
//         // 打开文档查看
//         uni.openDocument({
//           filePath: res.tempFilePath,
//           showMenu: true,
//           success: function (ress) {
//             console.log('成功打开文件')
//           },
//           fail() {
//             console.log('打开文件失败')
//           },
//         })
//       }
//     },
//   })
// }
// 下载文件
function downloadFile(url) {
  const newUrl = `${baseurl.value}${url}`
  uni.showLoading({ title: '正在下载……' })
  uni.downloadFile({
    url: newUrl,

    success: (data) => {
      if (data.statusCode === 200) {
        // 隐藏加载框
        uni.hideLoading()
        // 文件保存到本地
        uni.saveFile({
          tempFilePath: data.tempFilePath, // 临时路径
          success: function (res) {
            // console.log('打印res',res)
            uni.showToast({
              icon: 'success',
              mask: true,
              // title: '文件已保存：' + res.savedFilePath, //保存路径
              title: '保存成功',
              duration: 2000,
            })

            // 自动打开文档查看
            setTimeout(() => {
              const filePath = res.savedFilePath
              uni.openDocument({
                // 新开页面打开文档，支持格式：doc, xls, ppt, pdf, docx, xlsx, pptx。
                filePath,
                showMenu: true,
                success: function (res) {
                  console.log('打开文档成功')
                },
                fail: (e) => {
                  console.log(e, '打开失败')
                  const nowEno = uni.getSystemInfoSync().platform // 当前环境
                  // console.log('===========nowEno', nowEno)
                  if (nowEno == 'ios') {
                    // ios打开临时路径文件失败 设置ios环境下读取临时路径文件可以打开
                    uni.getFileSystemManager().readFile({
                      filePath,
                      success: (res) => {
                        const filebuffer = res.data
                        return filebuffer
                      },
                      fail: (err) => {
                        console.log(err)
                        // 图片
                        uni.saveImageToPhotosAlbum({
                          filePath,
                          success: (res) => {
                            uni.showToast({
                              title: '成功',
                              icon: 'none',
                            })
                          },
                          fail: (err) => {
                            uni.showToast({
                              title: '失败，请稍后重试',
                              icon: 'none',
                            })
                          },
                        })
                      },
                    })
                  } else {
                    uni.showToast({
                      title: '打开失败',
                    })
                  }
                },
              })
            }, 2000)
          },
        })
      }
    },
    fail: (err) => {
      console.log(err)
      uni.showToast({
        icon: 'none',
        mask: true,
        title: '文件下载失败',
      })
    },
  })
}
</script>
<style lang="scss">
::v-deep .wd-button.is-plain.is-primary {
  font-size: 28rpx !important;
  color: #e62929 !important;
  border-color: #e62929 !important;
}
.tobe-line {
  margin: 24rpx 0;
  border-bottom: 2rpx solid #ccc;
}
.tobe-title {
  margin-bottom: 28rpx;
  font-size: 18px;
  line-height: 25px;
  color: rgba(27, 27, 27, 1);
  text-align: justify;
}
.tobe-time {
  font-size: 16px;
  line-height: 20px;
  color: rgba(113, 113, 113, 1);
  text-align: justify;
}
.file-name {
  font-size: 32rpx;
  line-height: 40rpx;
  color: rgba(12, 113, 224, 1);
  text-align: center;
  padding: 20rpx 0;
}
rich-text {
  line-height: 1.7;
}
</style>
